<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>分类页</title>
    <link rel="stylesheet" href="./css/style.css">
</head>

<body>
    <div class="fix-title">
        <span>分类</span>
        <div class="text"><a href="search.html">搜索</a></div>
    </div>
    <ul class="cate-list">
        <li><a href="list.html">分类1</a></li>
        <li><a href="list.html">分类2</a></li>
        <li><a href="list.html">分类3</a></li>
        <li><a href="list.html">分类4</a></li>
        <li><a href="list.html">分类5</a></li>
    </ul>
</body>

<script>
    // const xhr = new XMLHttpRequest()
    // xhr.open('get', 'http://124.223.14.236:3001/api/goods/cate')
    // xhr.send()
    // xhr.onreadystatechange = () => {
    //     if (xhr.readyState === 4 && xhr.status === 200) {
    //         console.log(JSON.parse(xhr.responseText));
    //         const str = JSON.parse(xhr.responseText).data.map(item => {
    //             const { id, name } = item
    //             return `<li><a href="list.html?id=${id}">${name}</a></li>`
    //         }).join('')
    //         document.querySelector('.cate-list').innerHTML = str
    //     }
    // }
    const xhr = new XMLHttpRequest()
    xhr.open('get', 'http://124.223.14.236:3001/api/goods/cate')
    xhr.send()
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4 && xhr.status === 200) {
            // console.log(JSON.parse(xhr.responseText).data);
            const one = JSON.parse(xhr.responseText).data.map(function (item) {
                console.log(item);
                return `<li><a href="list.html?id=${item.id}">${item.name}</a></li> `
            }).join('')
            document.querySelector('.cate-list').innerHTML
                = one

        }
    }





</script>

</html>